<template>
    <div>
        <top-simple-search @searchFun="query">
            <template>
                <el-form-item label="">
                    <el-select v-model="searchParams.workflow_id" placeholder="请选择类型" clearable>
                        <el-option v-for="(item, index) in workflowsList" :key="index" :label="item.name"
                                   :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="">
                    <el-date-picker
                            v-model="time"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            size="small"
                            format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd"
                            style="margin-right: 10px"
                            end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>
            </template>
        </top-simple-search>
        <simple-table ref="myTable" :params="params">
            <el-table-column align="left" prop="title" label="标题" show-tooltip-when-overflow min-width="200">
                <template slot-scope="{row}">
                    <my-link @to="toDetail(row)">{{row.title}}</my-link>
                </template>
            </el-table-column>
            <el-table-column align="left" prop="workflow_info.workflow_name" label="类型" width="150"/>
            <el-table-column align="left" prop="creator_name" label="发起人" width="150"/>
            <el-table-column align="left" prop="gmt_created" label="提交时间" width="180"/>
            <el-table-column align="left" fixed="right" label="操作" width="80">
                <template slot-scope="{row}">
                    <edit-button v-if="row.editable&&isTodo" @click="toHandle(row)"></edit-button>
                    <my-button handle="chuli" v-else-if="isTodo" @click="toHandle(row)">处理</my-button>
                    <detail-button v-else @click="toHandle(row)"></detail-button>
                </template>
            </el-table-column>
        </simple-table>
        <all-detail-dialog :info="currRow" :visible.sync="visible" v-if="visible"  :showActiveBtn="isTodo" @reloadList="query" :isDaiyue="isDaiyue"></all-detail-dialog>
    </div>
</template>
<script>
    import MyLink from "../../components/MyLink/index";
    import api from "@/api/index"
    import AllDetailDialog from "./AllDetailDialog";
    export default {
        name: "TabContent",
        props:["params"],
        components: {AllDetailDialog, MyLink},
        data() {
            return {
                searchParams: {search_value: "", workflow_id: undefined, starttime:undefined,endtime:undefined},
                workflowsList:[],
                currRow:{},
                visible:false
            }
        },
        created() {
            this.getWorkflows()
        },
        computed: {
            isTodo() {
                return this.params.category == 'duty'
            },
            isDaiyue() {
                return this.params.category == 'daiyue'
            },
            time: {
                get() {
                    return this.searchParams.starttime && this.searchParams.endtime ? [this.searchParams.starttime, this.searchParams.endtime] : ["", ""]
                },
                set(v) {
                    if (v) {
                        this.searchParams.starttime = v[0]
                        this.searchParams.endtime = v[1]
                    } else {
                        this.searchParams.starttime = undefined
                        this.searchParams.endtime = undefined
                    }
                }
            }
        },
        methods: {
            query(queryData) {
                this.searchParams.search_value = queryData
                this.$refs["myTable"].searchList(this.searchParams);
            },
            toHandle(row){
                this.currRow = row
                this.visible = true
            },
            toDetail(row){
              this.$store.dispatch("common/toWorkList", {documentId: row.app_id,category:this.params.category}).then(res=>{
                this.$router.push({path: row.workflow_info.duty_li_pc});
              });
            },
            getWorkflows(){
                api.getWorkflows({ page: 1, per_page: 1000 }).then(res => {
                    this.workflowsList = res.data.value;
                });
            },
            getPath(params) {
                let url = ""
                if(params){
                    url = params.split("|")[0]
                }
                return url
            },
        }
    }
</script>
